@import '../var.less';

#fleetView {
  .main {
    margin-top: 15px;position: relative;

    .col-no-padding{
      .ivu-col{padding: 0 !important;}
    }
    .sub-content{
      position: relative;margin-top: 15px;
      >.ivu-row{
        &:not(:first-child){
          margin-top: 15px;
        }
      }
    }

    .chart-col{
      width: 270px;
      +.ivu-col{
        width: calc(~"100% - 270px");height: 317px;
        .ivu-row{
          height: calc(~"100% - 47px");
          .ivu-col{height: 100%;}
        }
        .ivu-card{
          height: 100%;
          .ivu-card-body{height: 100%;}
        }
        .search-box{height: 32px;text-align: right;margin-top: 15px;}
      }
    }

    .block {
      clear: both;margin-top: 0;padding: 0;
      >.block-header{
        margin-bottom: 10px;
        >h2{font-size: 16px;font-weight: 600;text-align: center;color: @title-color;}
      }
      >.block-body{clear: both;padding: 0;}
    }

    .dash-board-box{
      width: 100%;height: auto;
      >.dash-board-foot{
        width: 100%;height: auto;margin-top: -28px;
        .rank{
          width: 50%;margin: 0 auto;text-align: center;height: 28px;line-height: 28px;margin-bottom: 5px;
          background: #FFCC00;border-radius: 20px;
          >.rank-num{font-size: 16px;font-weight: bold;}
        }
        .info{
          width: 100%;display: table;height: 28px;line-height: 28px;
          >span{display: table-cell;text-align: center;}
        }
      }
    }

    .info-grid{
      height: 100%;
      >.grid-item{
        height: 50%;position: relative;
        &:first-child{
          padding-bottom: 16px;
          &:after{
            position: absolute;content: '';height: 1px;left: 0;right: 0;bottom: 0;background: @border-color-split;
          }
        }
        &:last-child{padding-top: 16px;}
      }
    }

    .data-box{
      height: 94px;text-align: center;
      >.data-number{
        height: 60px;line-height: 70px;font-size: 28px;
        >.unit{font-size: 12px;color: #999999;}
      }
      >.data-name{font-size: 12px;line-height: 24px;color: #999999;}
    }

    .list-info{
      height: 220px;
      >.list-item{
        height: 44px;line-height: 44px;
        >.item-name{float: left;}
        >.item-number{
          overflow: hidden;text-align: right;
          >.number{font-size: 20px;margin-right: 10px;}
        }
      }
    }

    .team-info{
      padding: 30px 0;height: 100%;
      h2{text-align: center;height: 36px;line-height: 36px;}

      .star{
        overflow: hidden;text-align: center;margin-top: 20px;
        >li{
          display: inline-block;width: 24px;height: 24px;position: relative;
          background: url('../../images/dog/star_k.png') no-repeat;background-size: 100%;
          &:after{
            content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;
            background-repeat: no-repeat;background-size: 100%;
          }
          &.all:after{background-image: url('../../images/dog/star_f.png');}
          &.hal:after{background-image: url('../../images/dog/star_b.png');}
        }
      }
      .info{
        width: 100%;display: flex;height: 30px;line-height: 30px;margin-top: 60px;
        >span{flex: 1;text-align: center;}
      }
    }
  }

  .habits-desc{
    font-size: @font-size-small;
    >span:not(:last-child){margin-right: 10px;}
  }
}
